.box{
    width: 100vw;
    height: 90vh;
    display: flex;
    flex-direction: column;
    position: relative;
  

    header{
        width: 100vw;
        height: 10vh;
        background: #fff;
        position: fixed;
        top: 0;
        z-index: 999;
        .adm-search-bar{
            width: 100%;
            height: 100%;
        
        }
    }
        .logo{  
        width: 100%;
        height: 15vh;
        font-size: 20px;
        font-weight: 600;
        z-index: 999;
        background: #fff;
        margin-top: 7vh;
        line-height: 10vh;
    }
     main{
        width: 100%;
        height: 100%;
       

    .adm-capsule-tabs{
        height: 100%;
        width: 100vw;
     
        .adm-capsule-tabs-content{
            // height: 100%;
            margin-top: 5vh;
            .tabs{
               
                .rv-pull-refresh{
                   .rv-pull-refresh__track{
                    width: 100%;
                    display: flex;
                    flex-wrap: wrap;
                    justify-content: space-around;

                            .context{
                                width: 45vw;
                                height: 13vh;
                                dl{
                                    width: 90%;
                                    height: 100%;
                                    dt{
                                        width: 100%;
                                        height: 70%;
                                        .adm-image{
                                            height: 100%;
                                    }
                                    }
                                    dd{
                                        width: 100%;
                                        height: 30%;
                                        text-align: center;
                                    }
                                    }

                            }
                        } 
               
                }

          
            }

        }
         .adm-capsule-tabs-header{
        background: #fff;
          z-index: 999;
        .adm-capsule-tabs-header-item{
            width: 100%;
            height: 100%;
            display: flex;
            justify-content: space-around;
            .adm-capsule-tabs-header-item-text{
                width: 100%;
                height: 100%;
                text-align: center;
                line-height: 8vh;
                font-size: 20px;
                font-weight: 600;
            }
        }
            .tabs{
                display: flex;
                flex-wrap: wrap;
                justify-content: space-around;
                position: absolute;
                top: 20vh;
                .context{
                width: 45vw;
                height: 20vh;
                dl{
                    width: 40vw;
                    height: 100%;
                    margin-top: 10px;
                    dt{
                        width: 100%;
                        height: 60%;
                        .adm-image{
                            width: 100%;
                            height: 85%;
                            box-shadow: 2px 2px 2px 2px #999;;
                    }
                    }
                    dd{
                        width: 100%;
                        height: 20%;
                        text-align: center;
                    }
                }
            
            }
            }

        }
         .adm-capsule-tabs-header{
        background: #fff;
         position: fixed;
          top: 15vh;
          z-index: 999;
    }
    }
   
  
    }
    
     
    }
    .tabbar{
        width: 100vw;
        height: 8vh;
        position: fixed;
        bottom: 0;
        z-index: 999;
        background: #fff;
            .adm-tab-bar{
            width: 100vw;
            height: 8vh;
            position: fixed;
            bottom: 0;
            z-index: 999;
            background: #fff;
            }
    }

